{namespace belog=TYPO3\CMS\Belog\ViewHelpers}

<f:comment>
	This is an ugly workaround.
	The function module in Web->Info already renders a form tag, and there is
	no easy way to circumvent this. The page id is needed for the info module
	that is not extbase based to figure the permissions. Thus, we have to add
	the page Id manually to hint the info module about that.
</f:comment>
<f:if condition="{constraint.isInPageContext}">
	<input type="hidden" name="id" value="{constraint.pageId}" />
</f:if>

<f:form object="{constraint}" action="index" name="constraint" class="form-inline form-inline-spaced">
	<div class="form-group">
		<label for="belog-users"><f:translate key="users" /></label>
		<f:form.select
			property="userOrGroup"
			options="{userGroups}"
			additionalAttributes="{onchange : 'submit()'}"
			class="form-control input-sm"
			id="belog-users"
		/>
	</div>

	<div class="form-group">
		<label for="belog-max"><f:translate key="max" /></label>
		<belog:form.translateLabelSelect
			property="number"
			options="{settings.selectableNumberOfLogEntries}"
			optionLabelPrefix="LLL:EXT:belog/Resources/Private/Language/locallang.xlf:"
			additionalAttributes="{onchange : 'submit()'}"
			class="form-control input-sm"
			id="belog-max"
		/>
	</div>

	<f:if condition="{belog:isExtensionLoaded(extensionKey:'workspaces')}">
		<f:if condition="{showWorkspaceSelector}">
				<div class="form-group">
					<label for="belog-workspaces"><f:translate key="workspace" /></label>
					<f:form.select
						property="workspaceUid"
						options="{workspaces}"
						additionalAttributes="{onchange : 'submit()'}"
						class="form-control input-sm"
						id="belog-workspaces"
					/>
				</div>
		</f:if>
	</f:if>

	<f:if condition="{constraint.isInPageContext}">
		<div class="form-group">
			<label for="belog-depth"><f:translate key="chLog_menuDepth" /></label>
			<f:form.select
				property="depth"
				options="{pageDepths}"
				additionalAttributes="{onchange : 'submit()'}"
				class="form-control input-sm"
				id="belog-depth"
			/>
		</div>
	</f:if>

	<div class="form-group">
		<label for="belog-time"><f:translate key="time" /></label>
		<belog:form.translateLabelSelect
			property="timeFrame"
			options="{settings.selectableTimeFrames}"
			optionLabelPrefix="LLL:EXT:belog/Resources/Private/Language/locallang.xlf:"
			additionalAttributes="{onchange : 'submit()'}"
			class="form-control input-sm"
			id="belog-time"
		/>
	</div>

	<div class="form-group">
		<label for="belog-action"><f:translate key="action" /></label>
		<belog:form.translateLabelSelect
			property="action"
			options="{settings.selectableActions}"
			optionLabelPrefix="LLL:EXT:belog/Resources/Private/Language/locallang.xlf:"
			additionalAttributes="{onchange : 'submit()'}"
			class="form-control input-sm"
			id="belog-action"
		/>
	</div>

	<div class="form-group">
		<label for="belog-group"><f:translate key="groupByPage" /></label>
		<f:form.checkbox
			property="groupByPage"
			value="1"
			additionalAttributes="{onchange : 'submit()'}"
			id="belog-group"
		/>
	</div>

	<f:comment>
		Date time fields for manual date selection
	</f:comment>


	<f:if condition="{constraint.timeFrame} == 30">
		<div class="form-group">
			<label for="manualDateStart"><f:translate key="LLL:EXT:lang/locallang_common.xlf:from" /></label>
			<div class="input-group input-group-sm">
				<f:form.textfield
						name="manualDateStart"
						value="{f:if(condition: constraint.startTimestamp, then: \"{f:format.date(format:'{settings.timeFormat} {settings.dateFormat}', date: '@{constraint.startTimestamp}')}\")}"
						id="manualDateStart"
						class="form-control input-sm t3js-datetimepicker t3js-clearable"
						data="{date-type: 'datetime', date-offset: 0}"
						/>
				<f:form.hidden property="startTimestamp" value="{constraint.startTimestamp}" />
				<span class="input-group-btn">
					<label class="btn btn-default" for="manualDateStart">
						<span class="fa fa-calendar"></span>
					</label>
				</span>
			</div>

		</div>

		<div class="form-group">
			<label for="manualDateStop"><f:translate key="LLL:EXT:lang/locallang_common.xlf:to" /></label>
			<div class="input-group input-group-sm">
				<f:form.textfield
						name="manualDateStop"
						value="{f:format.date(format:'{settings.timeFormat} {settings.dateFormat}', date: '@{constraint.endTimestamp}')}"
						id="manualDateStop"
						class="form-control input-sm t3js-datetimepicker t3js-clearable"
						data="{date-type: 'datetime', date-offset: 0}"
						/>
				<f:form.hidden property="endTimestamp" />
				<span class="input-group-btn">
					<label class="btn btn-default" for="manualDateStop">
						<span class="fa fa-calendar"></span>
					</label>
				</span>
			</div>
		</div>
	</f:if>

	<div class="form-group">
		<f:form.submit id="submit" value="{f:translate(key: 'set')}" class="btn btn-default btn-sm" />
	</div>
</f:form>
